<template>
  <viDialog
    :deptShow="true"
    :timeShow="true"
    :visibility.sync="visibility"
    title="近日明细"
    :deptList="deptList"
    :projectShow="true"
    @changeTime="changeTime"
    @changeDept="changeDept"
    @changeProject="changeProject"
  >
    <viTable :todayList="todayList" />
    <div class="vi-page">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 100, 200, 300, 400]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
  </viDialog>
</template>

<script>
import { viDialog, viBalance } from "@/components/visualization/index";
import viTable from "./table.vue";
import request from "@/utils/request";
import Qs from "qs";

export default {
  name: "vi-popup-detail",
  components: {
    viDialog,
    viBalance,
    viTable
  },
  props: {
    deptList: {
      default: () => []
    }
  },
  data() {
    return {
      visibility: false,
      accountTime: "",
      deptId: "",
      pageNum: 1,
      pageSize: 10,
      currentPage: 1,
      total: 0,
      todayList: [],
      projectId: null,
    };
  },
  created(){
    this.gettimes()
  },
  methods: {
    changeProject(val) {
      this.projectId = val;
      this.screenTodayFlow();
    },
    gettimes() {
      const time = new Date();
      const year = time.getFullYear();
      const month = time.getMonth() + 1;
      const day = time.getDate();
      
     
      this.accountTime=`${year}-${month}-${day}`
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.pageSize = val;
      this.screenTodayFlow();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.pageNum = val;
      this.screenTodayFlow();
    },
    open() {
      this.visibility = true;
      this.screenTodayFlow();
    },
    screenTodayFlow() {
      request({
        url: "system/screen/flowRecorder",
        method: "post",
        headers: { "content-type": "application/x-www-form-urlencoded" },
        data: Qs.stringify({
          // accountTime: this.accountTime,
          startTime: this.accountTime,
          endTime: this.accountTime,
          projectId: this.projectId,
          deptId: this.deptId || -1,
          pageNum: this.pageNum,
          pageSize: this.pageSize
        })
      }).then(res => {
        this.todayList = res.rows;
        this.total = res.total;
      });
    },
    changeDept(val) {
      // console.log(val)
      this.deptId = val || -1;
      this.screenTodayFlow();
    },
    changeTime(val) {
      // console.log(val)
      this.accountTime = val || "";
      this.screenTodayFlow();
    }
  }
};
</script>

<style scoped lang="scss">
@import "../style/detail.scss";
</style>
